<template>
  <p class="va-df-info-text" v-html="text"></p>
</template>

<script>
  import _ from 'lodash'
  import Emitter from '../utils/emitter-mixin'

  export default {
    mixins: [Emitter],
    props: {
      value: {},
      field: Object,
      disabled: Boolean
    },
    data () {
      return {
        text: '',
        updateText: _.debounce(() => {
          if (this.field.infoRenderer) {
            let rst = this.field.infoRenderer(this.value, this.model, this.formModel)
            if (rst && rst.then) {
              rst.then(data => {
                this.text = data
              })
            } else {
              this.text = rst
            }
          } else {
            this.text = this.value
          }
        }, 100)
      }
    },
    mounted () {
      this.updateText()
    },
    computed: {
      /*
      * 最近的具有model的组件（FormGroup或者DynamicForm）
      * */
      nmcComponent () {
        return this.findNMCParent()
      },
      /*
      * 上一层的Model，如果没有则等于formModel
      * */
      model () {
        return (this.nmcComponent && this.nmcComponent.model) || {}
      },
      formModel () {
        return (this.nmcComponent && this.nmcComponent.formModel) || {}
      }
    },
    methods: {
    },
    watch: {
      value () {
        this.updateText()
      },
      formModel: {
        deep: true,
        handler () {
          this.updateText()
        }
      }
    }
  }
</script>
